<template>
  <view 
    class="bg-#F1F1F1 color-#3A3A3A rounded-4rpx font-size-28rpx flex-center pl-12rpx pr-12rpx h-46rpx mr-8rpx leading-0"
    :class="[tagClass]"
    :style="tagStyle"
  >
    {{ text }}
    <slot />
  </view>
</template>

<script lang="ts" setup>
import { useThemeStore } from "@/store";
const { themeConfig } = useThemeStore()
defineProps({
  text: {
    type: String,
    default: ""
  },
  tagStyle: {
    type: [String, Object],
    default: () => ''
  },
  tagClass: {
    type: String,
    default: () => ''
  }
})
</script>

<script lang="ts">
export default {
  // 微信小程序开启样式穿透
  options: { styleIsolation: "shared" },
};
</script>

<style lang="scss" scoped>
.dark-color {
  background-color: #4b3d7c;
}
</style>
